<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('产值利润分析')"/>
    <th:block th:include="include :: layout-latest-css"/>
    <th:block th:include="include :: ztree-css"/>
</head>
<style>
    select {
        padding-top: 3px !important;
    }

    .select-list {
        margin-top: 5px !important;
    }

    .select-list li p {
        width: auto !important;
        margin-top: 7px !important;
    }

    .form-header {
        margin: 10px auto !important;

    }

    /*.table-striped .table > thead:first-child > tr:first-child > th {*/
        /*font-weight: normal;*/
        /*font-size: 13px;*/
        /*border: 1px solid #cccccc;*/
        /*border-right: none;*/
        /*border-top: 1px solid #cccccc !important;*/
    /*}*/
</style>
<body class="gray-bg">
<div class="ui-layout-center">
    <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="project-form">
                    <div class="col-sm-12">
                        <div class="select-list">
                            <ul>
                                <li>
                                    <p>单位：</p>
                                    <select name="compId" id="compId" class="form-control">
                                        <option value="">请选择</option>
                                        <option th:each="pro:${userComp}" th:value="${pro.compId}"
                                                th:text="${pro.compName}"></option>
                                    </select>

                                </li>
                                <li>
                                    <p>年份：</p>
                                    <select name="years" id="years" class="form-control">
                                        <option value="">请选择</option>
                                        <option value="2020">2020</option>
                                        <option value="2021">2021</option>
                                        <option value="2022">2022</option>
                                        <option value="2023">2023</option>
                                        <option value="2024">2024</option>
                                        <option value="2025">2025</option>
                                    </select>
                                </li>
                                <li>
                                    <p>月份：</p>
                                    <select name="months" id="months" class="form-control">
                                        <option value="">请选择</option>
                                        <option value="1">一月</option>
                                        <option value="2">二月</option>
                                        <option value="3">三月</option>
                                        <option value="4">四月</option>
                                        <option value="5">五月</option>
                                        <option value="6">六月</option>
                                        <option value="7">七月</option>
                                        <option value="8">八月</option>
                                        <option value="9">九月</option>
                                        <option value="10">十月</option>
                                        <option value="11">十一月</option>
                                        <option value="12">十二月</option>
                                    </select>
                                </li>
                                <li>
                                    <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i
                                            class="fa fa-search"></i>&nbsp;搜索</a>
                                    <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i
                                            class="fa fa-refresh"></i>&nbsp;重置</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </form>
            </div>
            <div class="col-sm-12 select-table table-striped">

                <div class="btn-group-sm" id="toolbar" role="group">
                    <a class="btn btn-primary single disabled" onclick="$.operate.edit()">
                        <i class="fa fa-edit"></i> 修改
                    </a>
                    <a class="btn btn-warning" onclick="exportEmpChange()">
                        <i class="fa fa-download"></i> 导出
                    </a>
                </div>
                <table id="czlrfy-table"></table>
                <div class="col-sm-12 sum"></div>
            </div>

        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: layout-latest-js"/>
<th:block th:include="include :: ztree-js"/>
<script th:inline="javascript">
    var prefix = ctx + "czlrfy";
    var sum;
    var value;
    $(function () {
        var czlrfy_options = {
            url: prefix + '/list',
            uniqueId: "id",
            id: 'czlrfy-table',
            removeUrl: prefix + "/remove",
            updateUrl: prefix + "/edit/{id}",
            modalName: "产值利润分析",
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            pagination:false,
            rowStyle: function (row, index) {
                var style = {};
                style={css:{'color':'#ed5565','font-weight':'700'}};

                if(row.compName=='合计'){
                    return style;
                }else {
                    return '';
                }

            },
            columns: [
                {
                    checkbox: true,
                },
                {
                    field: 'compName',
                    title: '工程公司名称',

                },
                {
                    field: 'years',
                    title: '年份',

                },
                {
                    field: 'months',
                    title: '月份',

                },
                {
                    field: 'monthEndNum',
                    title: '月末人数',

                },
                {
                    field: 'thisMonthsOutput',
                    title: '当月产值(万)',

                },
                {
                    field: 'thisMonthsAvgOutput',
                    title: '当月人均产值(万)',

                },
                {
                    field: 'totalOutput',
                    title: '总产值(万)',

                },
                {
                    field: 'totalAvgOutput',
                    title: '总人均产值(万)',

                },
                {
                    field: 'thisMonthsProfit',
                    title: '当月利润(万)',

                },
                {
                    field: 'thisMonthsAvgProfit',
                    title: '当月人均利润(万)',

                },
                {
                    field: 'totalProfit',
                    title: '总利润(万)',

                },
                {
                    field: 'totalAvgProfit',
                    title: '总人均利润(万)',

                },
                {
                    field: 'thisMonthsCost',
                    title: '当月费用(万)',

                },
                {
                    field: 'thisMonthsAvgCost',
                    title: '当月人均费用(万)',

                },
                {
                    field: 'totalCost',
                    title: '总费用(万)',

                },
                {
                    field: 'totalAvgCost',
                    title: '总人均费用(万)',

                },
            ]
        }
        $.table.init(czlrfy_options);
        //sum();
    })
    // function sum() {
    //     setTimeout(function () {
    //         value = $("#czlrfy-table").bootstrapTable('getData');
    //         var monthEndNum = 0;//月末人数(万)
    //         var thisMonthsOutput = 0;//当月产值(万)
    //         var thisMonthsAvgOutput = 0;//当月人均产值(万)
    //         var totalOutput = 0;//总产值(万)
    //         var totalAvgOutput = 0;//总人均产值(万)
    //         var thisMonthsProfit = 0;//当月利润(万)
    //         var thisMonthsAvgProfit = 0;//当月人均利润(万)
    //         var totalProfit = 0;//总利润(万)
    //         var totalAvgProfit = 0;//总人均利润(万)
    //         var thisMonthsCost = 0;//当月费用(万)
    //         var thisMonthsAvgCost = 0;//当月人均费用(万)
    //         var totalCost = 0;//总费用(万)
    //         var totalAvgCost = 0;//总人均费用(万)
    //         for (var i in value) {
    //
    //             monthEndNum += Number(value[i].monthEndNum);
    //             thisMonthsOutput += Number(value[i].thisMonthsOutput);
    //             totalOutput += Number(value[i].totalOutput);
    //             thisMonthsProfit += Number(value[i].thisMonthsProfit);
    //             totalProfit += Number(value[i].totalProfit);
    //             thisMonthsCost += Number(value[i].thisMonthsCost);
    //             totalCost += Number(value[i].totalCost);
    //         }
    //         if (value.length == 0) {
    //             thisMonthsAvgOutput = 0;//当月人均产值(万)
    //             totalAvgOutput = 0;//总人均产值(万)
    //             thisMonthsAvgProfit = 0;//当月人均利润(万)
    //             totalAvgProfit = 0;//总人均利润(万)
    //             thisMonthsAvgCost = 0;//当月人均费用(万)
    //             totalAvgCost = 0;//总人均费用(万)
    //         } else {
    //             thisMonthsAvgOutput = (thisMonthsOutput / monthEndNum).toFixed(2);
    //             totalAvgOutput = (totalOutput / monthEndNum).toFixed(2);
    //             thisMonthsAvgProfit = (thisMonthsProfit / monthEndNum).toFixed(2);
    //             totalAvgProfit = (totalProfit / monthEndNum).toFixed(2);
    //             thisMonthsAvgCost = (thisMonthsCost / monthEndNum).toFixed(2);
    //             totalAvgCost = (totalCost / monthEndNum).toFixed(2);
    //         }
    //
    //
    //         var html;
    //         html = '<div class="col-sm-12" style="text-align: center;">' + '<h3 style="display: inline;">合计：</h3>' +
    //             '<div style="display: inline">' +
    //             "月末人数：" + '<sapan style="color: red;">' + monthEndNum + '</sapan>' + "；" +
    //             "当月产值(万)：" + '<sapan style="color: red;">' + thisMonthsOutput + '</sapan>' + "；" +
    //             "当月人均产值(万)：" + '<sapan style="color: red;">' + thisMonthsAvgOutput + '</sapan>' + "；" +
    //             "总产值(万)：" + '<sapan style="color: red;">' + totalOutput + '</sapan>' + "；" +
    //             "总人均产值(万)：" + '<sapan style="color: red;">' + totalAvgOutput + '</sapan>' + "；" +
    //             "当月利润(万)：" + '<sapan style="color: red;">' + thisMonthsProfit + '</sapan>' + "；" +
    //             "当月人均利润(万)：" + '<sapan style="color: red;">' + thisMonthsAvgProfit + '</sapan>' + "；" +
    //             "总利润(万)：" + '<sapan style="color: red;">' + totalProfit + '</sapan>' + "；" +
    //             "总人均利润(万)：" + '<sapan style="color: red;">' + totalAvgProfit + '</sapan>' + "；" +
    //             "当月费用(万)：" + '<sapan style="color: red;">' + thisMonthsCost + '</sapan>' + "；" +
    //             "当月人均费用(万)：" + '<sapan style="color: red;">' + thisMonthsAvgCost + '</sapan>' + "；" +
    //             "总费用(万)：" + '<sapan style="color: red;">' + totalCost + '</sapan>' + "；" +
    //             "总人均费用(万)：" + '<sapan style="color: red;">' + totalAvgCost + '</sapan>' + "；" +
    //             '</div>' + '</div>';
    //         $(".sum").empty();
    //         $(".sum").append(html);
    //     }, 500);
    // }
    function exportEmpChange() {
        $('#czlrfy-table').bootstrapTable('hideColumn', 0);
        $("#czlrfy-table").tableExport({type: 'excel',
            fileName: '产值利润费用分析',
            exportDataType: "all",
        });
        $('#czlrfy-table').bootstrapTable('showColumn', 0);
    }
</script>
</body>
</html>